<!-- 必须全局拥有唯一的id -->
<div id="normalUpload">
  <el-row :gutter='20'>
    <el-col :span='12'>
      <el-upload class="upload-demo" action="http://172.16.40.140:8080/crmnewweb/FileUpload" :on-preview="handlePreview" :on-remove="handleRemove" :before-upload="beforeAvatarUpload"
        :file-list="fileList">
        <el-button size="small" type="primary">点击上传</el-button>
      </el-upload>
    </el-col>
    <el-col :span='12'>
      <el-upload ref='singleup' class="upload-demo" action="http://172.16.40.140:8080/crmnewweb/FileUpload" :on-preview="handlePreview" multiple :on-remove="handleRemove" :file-list="singleFileUp">
        <el-button size="small" type="primary">点击上传</el-button>
        <div slot="tip" class="el-upload__tip">同时上传多个文件</div>
      </el-upload>
    </el-col>
  </el-row>
  <el-row :gutter='20'>
    <el-col :span="12">
      <el-upload class="upload-demo" drag action="http://172.16.40.140:8080/crmnewweb/FileUpload" multiple>
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将文件拖到此处，或
          <em>点击上传</em>
        </div>
        <div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
      </el-upload>
    </el-col>
    <el-col :span='12'>
      <el-upload class="avatar-uploader" action="http://172.16.40.140:8080/crmnewweb/FileUpload" :show-file-list="false" :on-success="handleAvatarSuccess" :before-upload="beforeAvatarUpload">
        <img v-if="imageUrl" :src="imageUrl" class="avatar">
        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
      </el-upload>
    </el-col>
  </el-row>
</div>

<style>
  #normalUpload .el-row{margin-top: 10px;}
  #normalUpload .el-col>div{background: #fff;height: 200px;padding: 10px 10px; }
  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #20a0ff;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 178px;
    height: 178px;
    line-height: 178px;
    text-align: center;
  }
  .avatar {
    width: 178px;
    height: 178px;
    display: block;
  }
</style>